#include("header.html")
<script>
    $(document).ajaxStart(function () {
        $('#loading').removeClass('hidden');
    }).ajaxStop(function () {
        $('#loading').addClass('hidden');
    });

    $(function () {
        var ul = $('#rank-list');
        $('select').change(function () {
            var type = $('select[name="type"]').val();

            $.post('/shop/page', {
                pageNo: 1,
                type: type
            }, function (data) {
                fillData(data.data);
            });
        });

        function fillData(pd) {
            ul.html('<li><div class="alert alert-xs label-warning text-white">\n' +
                '暂无排名信息 \n' +
                '</div></li>');

            if (pd !== null) {
                if (pd.numberOfElements > 0) {
                    ul.html('');
                    $.each(pd.content, function (k, v) {
                        var li = '<li>\n' +
                            '    <div class="class-box">\n' +
                            '        <div class="class-up bg-danger">\n' +
                            '            <p>\n' +
                            '                <span>'+v.name+'</span>\n' +
                            '                <span style="background: #f56954;" class="badge pull-right">'+(k+1)+'</span>\n' +
                            '            </p>\n' +
                            '            <p>\n' +
                            '                <span>电话：'+v.tel+'</span>\n' +
                            '                <span>邮箱：'+v.email+'</span>\n' +
                            '            </p>\n' +
                            '        </div>\n' +
                            '        <div class="class-down clearfix">\n' +
                            '            <p>地址：'+v.address+'</p>\n' +
                            '            <p><span class=" badge">'+v.total.toFixed(2)+'</span></p>\n' +
                            '        </div>\n' +
                            '    </div>\n' +
                            '</li>';

                        ul.append(li);
                    });
                }
            }
        }
    });
</script>
<div class="container">
    <div class="box box-danger">
        <div class="box-header">
            <div class="text-center">
                <span class="h-title">公司排名</span>
                <div id="loading" class="hidden" style="position: absolute; right: 15px; top: 12px;">
                    <img class="" width="20" src="/static/images/loading.jpg" alt="上传中">
                </div>
            </div>
        </div>
        <div class="box-body">
            <div class="select-group text-right">
                <span style="color: #d98103;">类型：</span>
                <select name="type" class="form-control">
                    <option value="">全部公司</option>
                    <option value="1">物业公司</option>
                    <option value="2">学生食堂</option>
                    <option value="4">教师食堂</option>
                    <option value="3">学生浴池</option>
                </select>
            </div>
            <ul id="rank-list" class="list-unstyled">
                #for(Shop shop : pages.content)
                <li>
                    <div class="class-box">
                        <div class="class-up bg-danger">
                            <p>
                                <span>${shop.name ?! '食堂'}</span>
                                <span style="background: #f56954;" class="badge pull-right">${for.index}</span>
                            </p>
                            <p>
                                <span>电话：${shop.tel ?! ''}</span>
                                <span>邮箱：${shop.email ?! ''}</span>
                            </p>
                        </div>
                        <div class="class-down clearfix">
                            <p>地址：${shop.address ?! ''}</p>
                            <p><span class=" badge">${shop.total.format('0.00') ?! '0'}</span></p>
                        </div>
                    </div>
                </li>
                #else
                <li>
                    <div class="alert alert-xs label-warning text-white">
                        暂无排名信息
                    </div>
                </li>
                #end
            </ul>
            #include("sign.html")
        </div>
    </div>
</div>
</body>
</html>